<template>
  <view v-if="shenheStatus == 0" class="juniorShop">
    <view class="shopItem" v-for="(item, index) in shopList" :key="index">
      <view class="title">
        <text>{{ item.name }}</text>
        <text>{{ item.cat_name || '' }}</text>
      </view>
      <view class="shopInfo">
        <image class="pic" :src="item.logo"></image>
        <view class="info">
          <text>{{ item.mobile }}</text>
          <text>{{ $t('share.regTime') }}：{{ item.created_at }}</text>
        </view>
      </view>
    </view>
  </view>
  <Shenhe v-else-if="shenheStatus == 1"></Shenhe>
</template>

<script>
import Shenhe from '@/components/shenhe/shenhe';
export default {
  components: { Shenhe },
  data() {
    return {
      // 店铺列表
      shopList: [],
      // 当前所在分页
      page: 1,
      // 数据是否加载结束
      noMore: false,
    };
  },
  methods: {
    // 获取店铺列表
    async getList() {
      const res = await this.$allrequest.merchant.storeList(
        {
          page: this.page,
        },
        true
      );
      if (res.code == 0) {
        this.shopList = [...this.shopList, ...res.data.list];
        if (this.shopList.length >= res.data.row_count) {
          this.noMore = true;
        } else {
          this.noMore = false;
        }
      }
    },
  },
  onLoad() {
    this.getList();
  },
  onReachBottom() {
    if (!this.noMore) {
      this.page++;
      this.getList();
    }
  },
};
</script>

<style lang="scss" scoped>
.juniorShop {
  min-height: 100vh;
  background-color: #f2f2f2;
  padding-top: 24rpx;
  font-family: PingFang SC;
  color: #262626;
  .shopItem {
    margin-bottom: 24rpx;
    width: 100%;
    background-color: #fff;
    padding: 30rpx;
    .title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 24rpx;
      color: #8c8c8c;
      text:nth-child(1) {
        font-size: 28rpx;
        font-weight: 600;
        color: #262626;
      }
    }
    .shopInfo {
      margin-top: 30rpx;
      display: flex;
      .pic {
        width: 100rpx;
        height: 100rpx;
        border-radius: 10rpx;
        background-color: #f2f2f2;
      }
      .info {
        margin-left: 20rpx;
        display: flex;
        flex-direction: column;
        font-size: 28rpx;
        text:nth-child(2) {
          font-size: 24rpx;
          margin-top: 8rpx;
          color: #8c8c8c;
        }
      }
    }
  }
}
</style>
